<%@page pageEncoding="utf-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<base href="<%=request.getContextPath()%>/">
<link rel="stylesheet" href="about/css/bootstrap.min.css">
<link href="about/css/myCss.css" type="text/css" rel="stylesheet">
<link href="about/css/main.css" type="text/css" rel="stylesheet">
<link href="about/css/base.css" type="text/css" rel="stylesheet">
<!--按钮样式表-->
<link href="about/css/btn.css" type="text/css" rel="stylesheet">
<link href="about/css/css.css" type="text/css" rel="stylesheet">
<link href="about/css/index.css" type="text/css" rel="stylesheet">
<link href="about/css/search.css" type="text/css" rel="stylesheet">

<title>外出登记</title>
<script type="text/javascript">
		
		</script>
</head>
<body>
	<c:set var="url" value="/beadhouse/outgoing" />
	<div class="hlnr page">
		<div class="col-md-12 pd20 RightContentBody fmt10">
			<div class="col-md-3 pd0 fmt5">
				<div class="input-group inputWidth_search">
					<form action="" id="listForm">
						<input name="key" type="text" class="form-control"
							placeholder="客户姓名"> <input name="pageNo" value="1"
							type="hidden"> <input name="pageSize" value="5"
							type="hidden">
					</form>
					<span class="input-group-addon"><a
						href="javascript:document:listForm.submit();">查询</a></span>
				</div>
			</div>
			<div class="col-md-9 pd0 fmt5">
				<button id="addOg" class="btn btn-primary" data-toggle="modal"
					data-target=".myModal1">
					<span class="glyphicon glyphicon-plus"></span>&nbsp;登记
				</button>
			</div>
			<form action="" id="addForm">
				<input type="hidden" id="updateId" name="id" value="">
				<div class="modal fade myModal1">
					<div class="modal-dialog">
						<div class="modal-content" style="width: 100%;">
							<div class="modal-header">
								<button type="button" class="close" data-dismiss="modal"
									aria-label="Close">
									<span aria-hidden="true">&times;</span>
								</button>
								<span class="glyphicon glyphicon-pencil"></span>&nbsp;【外出登记】
							</div>
							<div class="modal-body clearfix" style="height: auto;">
								<div class="col-md-12 pd0">
									<div class="col-md-1 pd0 mt10"></div>
									<div class="col-md-10 pd0">
										<div class="col-md-12 pd0">
											<div class="input-group inputWidth">
												<span class="input-group-addon titleWidth">&nbsp;&nbsp;客户：</span>
												<select name="customerId" id="customerNameList" class="form-control">													
												</select>
											</div>
										</div>
									</div>
									<div class="col-md-1 pd0"></div>
								</div>
								<div class="col-md-12 pd0 mt10">
									<div class="col-md-1 pd0"></div>
									<div class="col-md-10 pd0">
										<div class="col-md-12 pd0">
											<div class="input-group inputWidth">
												<span class="input-group-addon titleWidth">&nbsp;&nbsp;外出事由：</span>
												<input name="outgoingReason" type="text"
													class="form-control" value="">
											</div>
										</div>
									</div>
									<div class="col-md-1 pd0"></div>
								</div>
								<div class="col-md-12 pd0 mt10">
									<div class="col-md-1 pd0"></div>
									<div class="col-md-10 pd0">
										<div class="col-md-12 pd0">
											<div class="input-group inputWidth">
												<span class="input-group-addon titleWidth">&nbsp;&nbsp;外出时间：</span>
												<input name="outgoingTime" type="date" class="form-control">
											</div>
										</div>
									</div>
									<div class="col-md-1 pd0"></div>
								</div>
								<div class="col-md-12 pd0 mt10">
									<div class="col-md-1 pd0"></div>
									<div class="col-md-10 pd0">
										<div class="col-md-12 pd0">
											<div class="input-group inputWidth">
												<span class="input-group-addon titleWidth">&nbsp;&nbsp;预计回院时间：</span>
												<input name="expectedReturnTime" type="date"
													class="form-control">
											</div>
										</div>
									</div>
									<div class="col-md-1 pd0"></div>
								</div>
								<div class="col-md-12 pd0 mt10">
									<div class="col-md-1 pd0"></div>
									<div class="col-md-10 pd0">
										<div class="col-md-12 pd0">
											<div class="input-group inputWidth">
												<span class="input-group-addon titleWidth">&nbsp;&nbsp;陪同人：</span>
												<input name="escorted"  type="text" class="form-control">
											</div>
										</div>
									</div>
									<div class="col-md-1 pd0"></div>
								</div>
								<div class="col-md-12 pd0 mt10">
									<div class="col-md-1 pd0"></div>
									<div class="col-md-10 pd0">
										<div class="col-md-12 pd0">
											<div class="input-group inputWidth">
												<span class="input-group-addon titleWidth">&nbsp;&nbsp;与老人关系：</span>
												<input name="relation" type="text" class="form-control">
											</div>
										</div>
									</div>
									<div class="col-md-1 pd0"></div>
								</div>
								<div class="col-md-12 pd0 mt10">
									<div class="col-md-1 pd0"></div>
									<div class="col-md-10 pd0">
										<div class="col-md-12 pd0">
											<div class="input-group inputWidth">
												<span class="input-group-addon titleWidth">&nbsp;&nbsp;陪同人电话：</span>
												<input name="escortedTel" type="text" class="form-control">
											</div>
										</div>
									</div>
									<div class="col-md-1 pd0"></div>
								</div>
								<div class="col-md-12 pd0 mt10">
									<div class="col-md-1 pd0"></div>
									<div class="col-md-10 pd0">
										<div class="col-md-12 pd0">
											<div class="input-group inputWidth">
												<span class="input-group-addon titleWidth">&nbsp;&nbsp;备注：</span>
												<input name="remark" type="text" class="form-control">
											</div>
										</div>
									</div>
									<div class="col-md-1 pd0"></div>
								</div>
							</div>
							<div class="modal-footer mt20">
								<button id="addBut" type="submit" class="btn btn-primary"
									data-dismiss="modal">确定</button>
								<button type="button" class="btn btn-default"
									data-dismiss="modal">取消</button>
							</div>
						</div>
					</div>
				</div>
			</form>
			<div id="myModal2" class="modal fade myModal2">
				<div class="modal-dialog">
					<div class="modal-content" style="width: 100%;">
						<div class="modal-header">
							<button type="button" class="close" data-dismiss="modal"
								aria-label="Close">
								<span aria-hidden="true">&times;</span>
							</button>
							<span class="glyphicon glyphicon-pencil"></span>&nbsp;【审批】
						</div>
						<div class="modal-body clearfix" style="height: auto;">
							<div class="col-md-12 pd0">
								<div class="col-md-1 pd0 mt10"></div>
								<div class="col-md-10 pd0">
									<div class="col-md-12 pd0">
										<div class="input-group inputWidth">
											<span class="input-group-addon titleWidth">&nbsp;&nbsp;审批状态：</span>
											<form action="" id="selectForm">
												<select id="selectApproval" class="form-control"
													name="approval">
													<option value="通过">通过</option>
													<option value="不通过">不通过</option>
												</select> <input type="hidden" id="approvalId" name="id" value="">
											</form>
										</div>
									</div>
								</div>
								<div class="col-md-1 pd0"></div>
							</div>
						</div>
						<div class="modal-footer mt20">
							<button id="approvalBut" type="submit" class="btn btn-primary"
								data-dismiss="modal">确定</button>
							<button type="button" class="btn btn-default"
								data-dismiss="modal">取消</button>
						</div>
					</div>
				</div>
			</div>
			<div class="col-md-12 pd0 fmt10">
				<hr class="commonHRCss" />
			</div>
			<!-- <div>${og.rows[0]}</div>
				 -->
			<div class="col-md-12 pd0">
				<table class="table table-hover">
					<thead>
					<c:if test="${og.totalRows!=0}">
						<tr>
							<th></th>
							<th>序号</th>
							<th>客户姓名</th>
							<th>性别</th>
							<th>年龄</th>
							<th>档案号</th>
							<th>外出事由</th>
							<th>外出时间</th>
							<th>预计回院时间</th>
							<th>实际回院时间</th>
							<th>陪同人</th>
							<th>与老人关系</th>
							<th>陪同人电话</th>
							<th>审批状态</th>
							<th>审批人</th>
							<th>审批时间</th>
							<th>备注</th>
							<th>操作</th>
						</tr>
						</c:if>
					</thead>
					<tbody>
						<c:if test="${og.totalRows==0}">
								<tr>
									<td width="100%">木有东西！</td>
								</tr>
						</c:if>					
					<c:if test="${og.totalRows!=0}">					
							<c:forEach varStatus="vs" items="${og.rows}" var="one">
								<tr>
									<td></td>
									<td>${vs.count}</td>
									<td>${one.customerName}</td>
									<td><c:if test="${one.customerSex==false}">女</c:if>
										<c:if test="${one.customerSex==true}">男</c:if></td>
									<td>${one.customerAge}</td>
									<td>${one.recordId}</td>
									<td>${one.outgoingReason}</td>
									<td><fmt:formatDate value='${one.outgoingTime}' pattern='yyyy-MM-dd'/>
									</td>
									<td><fmt:formatDate value='${one.expectedReturnTime}' pattern='yyyy-MM-dd'/>
									</td>
									<td><fmt:formatDate value='${one.actualReturnTime}' pattern='yyyy-MM-dd'/>
									</td>
									<td>${one.escorted}</td>
									<td>${one.relation}</td>
									<td>${one.escortedTel}</td>
									<td>${one.auditStatus}</td>
									<td>${one.auditPerson}</td>
									<td><fmt:formatDate value='${one.auditTime}' pattern='yyyy-MM-dd'/>
									</td>
									<td>${one.remark}</td>
									<td>
										
										<button onclick="updateValues(${one.id})"
											class="btn btn-primary" data-toggle="modal"
											data-target=".myModal4">修改</button>
										<button onclick="delValues(${one.id})" id="deleteBtn"
											class="btn btn-danger">删除</button>
										
										<button id="appToBtn" onclick="appValues(${one.id})"
											class="btn btn-success" data-toggle="modal"
											data-target=".myModal2">
											审批
										</button>
										<button id="updateTimeBtn"
											onclick="updateTimeValues(${one.id})"
											class="btn btn-warning" data-toggle="modal"
											data-target=".myModal3">&nbsp;&nbsp;
											<span class="glyphicon glyphicon-plus"></span>&nbsp;&nbsp;&nbsp;
											登记回院时间&nbsp;</button>
										
									</td>
								</tr>
							</c:forEach>
							</c:if>				
					</tbody>
				</table>
			</div>
			<div class="col-md-12 pd0">
				<div class="col-md-12 text-right pd0 fmt20">
					<nav aria-label="Page navigation">
						<ul class="pagination">
						<c:if test="${og.pageNo==1}">
							<li><a href="javaScript:void(0);" aria-label="Previous"> <span
									aria-hidden="true">&laquo;</span>
							</a></li>
						</c:if>
						<c:if test="${og.pageNo>1}">
							<li><a href="outgoing/list?pageNo=${og.pageNo-1}" aria-label="Previous"> <span
									aria-hidden="true">&laquo;</span>
							</a></li>
						</c:if>
							<c:forEach var="i" begin="1" end="${og.totalPages}" step="1">
								<li><a href="javaScript:void(0);">${i}</a></li>
							</c:forEach>
						<c:if test="${og.pageNo==og.totalPages}">
							<li><a href="javaScript:void(0);" aria-label="Next"> <span
									aria-hidden="true">&raquo;</span>
							</a></li>
						</c:if>
						<c:if test="${og.pageNo<og.totalPages}">
							<li><a href="outgoing/list?pageNo=${og.pageNo+1}" aria-label="Next"> <span
									aria-hidden="true">&raquo;</span>
							</a></li>
						</c:if>
						</ul>
					</nav>
				</div>
			</div>
		</div>
	</div>

	<!--模态框-->
	<div class="modal fade myModal3">
		<div class="modal-dialog">
			<div class="modal-content" style="width: 100%;">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal"
						aria-label="Close">
						<span aria-hidden="true">&times;</span>
					</button>
					<span class="glyphicon glyphicon-pencil"></span>&nbsp;【登记回院时间】
				</div>
				<div class="modal-body clearfix" style="height: auto;">
					<div class="col-md-12 pd0">
						<div class="col-md-1 pd0 mt10"></div>
						<div class="col-md-10 pd0">
							<div class="col-md-12 pd0">
								<div class="input-group inputWidth">
									<span class="input-group-addon titleWidth">&nbsp;&nbsp;时间回院时间：</span>
									<form action="" id="updateTimeForm">
										<input name="actualReturnTime" type="date"	class="form-control" />
										<input type="hidden" id="updateTimeId" name="customerId" value="">
									</form>
								</div>
							</div>
						</div>
						<div class="col-md-1 pd0"></div>
					</div>
				</div>
				<div class="modal-footer mt20">
					<button id="updateTime" type="submit" class="btn btn-primary"
						data-dismiss="modal">确定</button>
					<button type="button" class="btn btn-default" data-dismiss="modal">
						取消</button>
				</div>
			</div>
		</div>
	</div>

	<form action="" id="updateForm">
		<input type="hidden" id="toupdateId" name="id" value="">
		<div class="modal fade myModal4">
			<div class="modal-dialog">
				<div class="modal-content" style="width: 100%;">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal"
							aria-label="Close">
							<span aria-hidden="true">&times;</span>
						</button>
						<span class="glyphicon glyphicon-pencil"></span>&nbsp;【修改】
					</div>
					<div class="modal-body clearfix" style="height: auto;">
						<div class="col-md-12 pd0">
							<div class="col-md-1 pd0 mt10"></div>
							<div class="col-md-10 pd0">
								<div class="col-md-12 pd0">
									<div class="input-group inputWidth">
										<span class="input-group-addon titleWidth">&nbsp;&nbsp;客户：</span>
										<input id="customerNameIn" name="customerName"
											class="form-control" value="" disabled/>
									</div>
								</div>
							</div>
							<div class="col-md-1 pd0"></div>
						</div>
						<div class="col-md-12 pd0 mt10">
							<div class="col-md-1 pd0"></div>
							<div class="col-md-10 pd0">
								<div class="col-md-12 pd0">
									<div class="input-group inputWidth">
										<span class="input-group-addon titleWidth">&nbsp;&nbsp;外出事由：</span>
										<input id="outgoingReasonIn" name="outgoingReason"
											class="form-control" value="" />
									</div>
								</div>
							</div>
							<div class="col-md-1 pd0"></div>
						</div>
						<div class="col-md-12 pd0 mt10">
							<div class="col-md-1 pd0"></div>
							<div class="col-md-10 pd0">
								<div class="col-md-12 pd0">
									<div class="input-group inputWidth">
										<span class="input-group-addon titleWidth">&nbsp;&nbsp;外出时间：</span>
										<input id="outgoingTimeIn" name="outgoingTime"
											class="form-control" value="" type="date" />
									</div>
								</div>
							</div>
							<div class="col-md-1 pd0"></div>
						</div>
						<div class="col-md-12 pd0 mt10">
							<div class="col-md-1 pd0"></div>
							<div class="col-md-10 pd0">
								<div class="col-md-12 pd0">
									<div class="input-group inputWidth">
										<span class="input-group-addon titleWidth">&nbsp;&nbsp;预计回院时间：</span>
										<input id="expectedReturnTimeIn" name="expectedReturnTime"
											class="form-control" value="" type="date" />
									</div>
								</div>
							</div>
							<div class="col-md-1 pd0"></div>
						</div>
						<div class="col-md-12 pd0 mt10">
							<div class="col-md-1 pd0"></div>
							<div class="col-md-10 pd0">
								<div class="col-md-12 pd0">
									<div class="input-group inputWidth">
										<span class="input-group-addon titleWidth">&nbsp;&nbsp;实际回院时间：</span>
										<input id="actualReturnTimeIn" name="actualReturnTime"
											class="form-control" type="date" />
									</div>
								</div>
							</div>
							<div class="col-md-1 pd0"></div>
						</div>
						<div class="col-md-12 pd0 mt10">
							<div class="col-md-1 pd0"></div>
							<div class="col-md-10 pd0">
								<div class="col-md-12 pd0">
									<div class="input-group inputWidth">
										<span class="input-group-addon titleWidth">&nbsp;&nbsp;陪同人：</span>
										<input id="escortedIn" name="escorted" class="form-control"
											value="" />
									</div>
								</div>
							</div>
							<div class="col-md-1 pd0"></div>
						</div>
						<div class="col-md-12 pd0 mt10">
							<div class="col-md-1 pd0"></div>
							<div class="col-md-10 pd0">
								<div class="col-md-12 pd0">
									<div class="input-group inputWidth">
										<span class="input-group-addon titleWidth">&nbsp;&nbsp;与老人关系：</span>
										<input id="relationIn" name="relation" class="form-control"
											value="" />
									</div>
								</div>
							</div>
							<div class="col-md-1 pd0"></div>
						</div>
						<div class="col-md-12 pd0 mt10">
							<div class="col-md-1 pd0"></div>
							<div class="col-md-10 pd0">
								<div class="col-md-12 pd0">
									<div class="input-group inputWidth">
										<span class="input-group-addon titleWidth">&nbsp;&nbsp;陪同人电话：</span>
										<input id="escortedTelIn" name="escortedTel"
											class="form-control" value="" />
									</div>
								</div>
							</div>
							<div class="col-md-1 pd0"></div>
						</div>
						<div class="col-md-12 pd0 mt10">
							<div class="col-md-1 pd0"></div>
							<div class="col-md-10 pd0">
								<div class="col-md-12 pd0">
									<div class="input-group inputWidth">
										<span class="input-group-addon titleWidth">&nbsp;&nbsp;备注：</span>
										<input id="remarkIn" name="remark" class="form-control" />
									</div>
								</div>
							</div>
							<div class="col-md-1 pd0"></div>
						</div>
					</div>
					<div class="modal-footer mt20">
						<button id="updateBtn" type="submit" class="btn btn-primary"
							data-dismiss="modal">确定</button>
						<button type="button" class="btn btn-default" data-dismiss="modal">
							取消</button>
					</div>
				</div>
			</div>
		</div>
	</form>
</body>
<script src="about/js/jquery.min.js"></script>
<script src="about/js/bootstrap.min.js"></script>
<script>
	var $AddBut,
	$ApprovalBut,
	$CustomerId,
	$SelectApproval,
	$MyModal2id,
	$UpdateTime,
	$UpdateBtn,
	$UpdateForm,
	$AddForm,
	$SelectForm,
	$UpdateTimeForm,
	$CustomerNameList,
	$AddOg
;
$(function(){
	$AddBut=$("#addBut");
	$AddBut.click(addButClick);
	$ApprovalBut=$("#approvalBut");
	$ApprovalBut.click(approvalButClick);
	$CustomerId=$("#customerId").val();
	$ApprovalId=$("#approvalId");
	$UpdateTime=$("#updateTime");
	$UpdateTime.click(updateTimeClick);
	$UpdateBtn=$("#updateBtn").click(updateClick);
	$UpdateForm=$("#updateForm");
	$AddForm=$("#addForm");
	$SelectForm=$("#selectForm");
	$UpdateTimeForm=$("#updateTimeForm");
	$CustomerNameList=$("#customerNameList");
	$AddOg=$("#addOg");
	$AddOg.click(selectCustomerAllName);
	
});

function previewPage(no){
	no=no+1;
	var url="/beadhouse/outgoing/list";
	$.get(url,{
		pageNo:no
	},function(resp){
		alert(resp.code)
	})
}





var selectCustomerAllName=function(evt){
	var html="";
	evt.preventDefault();
	var url="/beadhouse/api/customer/selectAll";
	$.get(url,function(resp){
		var rows=resp.data;
		if(resp.code=="ok"){
			html+="<option>请选择</option>"
			for (var i = 0; i < rows.length; i++) {
				html+='<option value="'+rows[i].id+'">'+rows[i].customerName+'</option>';
			}
			$CustomerNameList.html(html);
		}
	})
};

var updateClick=function(evt){
	evt.preventDefault();
	var url="/beadhouse/outgoing/update";
	$.get(url,$UpdateForm.serialize(),function(resp){
		if(resp.code=="ok"){
			window.location.href="/beadhouse/outgoing/list";
		
		}
	})
};

var addButClick=function(evt){
	evt.preventDefault();
	var url="/beadhouse/outgoing/add";
	$.get(url,$AddForm.serialize(),function(resp){
		if(resp.code=="ok"){
			window.location.href="/beadhouse/outgoing/list";
		
		}
	})
};
var approvalButClick=function(evt){
	evt.preventDefault();
	var url="/beadhouse/outgoing/approval";
	$.get(url,$SelectForm.serialize(),function(resp){				
		if(resp.code=="ok"){
			window.location.href="/beadhouse/outgoing/list";
		}
	})
};
function appValues(ID){
	$("#approvalId").val(ID);
}
function delValues(ID){
	var url="/beadhouse/outgoing/delete";
	$.get(url,{
		id:ID
	},function(resp){				
		if(resp.code=="ok"){
			window.location.href="/beadhouse/outgoing/list";
		}
	})
	return false;
}
var updateTimeClick=function(evt){
	evt.preventDefault();
	var url="/beadhouse/outgoing/updateTime";
	$.get(url,$UpdateTimeForm.serialize(),function(resp){	
		if(resp.code=="ok"){
			window.location.href="/beadhouse/outgoing/list";
		}
	})
};
function updateTimeValues(ID){
	$("#updateTimeId").val(ID);
}
function updateValues(ID){
	var url="/beadhouse/outgoing/check";
	$.get(url,{id:ID},function(resp){	
		if(resp.code=="ok"){
			$("#toupdateId").val(resp.data.id);
			$("#customerNameIn").val(resp.data.customerName);
			$("#outgoingReasonIn").val(resp.data.outgoingReason);
			$("#outgoingTimeIn").val(toDate(resp.data.outgoingTime));
			$("#expectedReturnTimeIn").val(toDate(resp.data.expectedReturnTime));
			$("#actualReturnTimeIn").val(toDate(resp.data.actualReturnTimeIn));
			$("#escortedIn").val(resp.data.escorted);
			$("#relationIn").val(resp.data.relation);
			$("#escortedTelIn").val(resp.data.escortedTel);
			$("#remarkIn").val(resp.data.remark);
		}
	})
	return false;
}
var toDate=function(inputTime){
	if(inputTime==null){
		return inputTime;
	}
	var date = new Date(inputTime);
    var y = date.getFullYear();  
    var m = date.getMonth() + 1;  
    m = m < 10 ? ('0' + m) : m;  
    var d = date.getDate();  
    d = d < 10 ? ('0' + d) : d;  
    var h = date.getHours();
    h = h < 10 ? ('0' + h) : h;
    var minute = date.getMinutes();
    var second = date.getSeconds();
    minute = minute < 10 ? ('0' + minute) : minute;  
    second = second < 10 ? ('0' + second) : second; 
    return y + '-' + m + '-' + d;
}
	</script>
</html>
